<!--
 * @Author: 噜噜雯雯 2199987619@qq.com
 * @Date: 2025-06-26 14:15:23
 * @LastEditors: 噜噜雯雯 2199987619@qq.com
 * @LastEditTime: 2025-07-04 14:18:36
 * @FilePath: \linePatrol\vue-element-plus-admin\src\views\GIS\OneMap\HideDanger.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<script setup lang="tsx">
import { ElCard, ElTabPane, ElTabs, TabsPaneContext } from 'element-plus'
import { ref } from 'vue'
import { useDictStore } from '@/store/modules/dictData'
import { useGISStore } from '@/store/modules/gis'
import HideDangerCard from './components/HideDangerCard.vue'
const activeName = ref('all')
const DictStore = useDictStore()
const GISStore = useGISStore()
DictStore.setDict('event_state') //应急状态字典
const handleClick = (tab: TabsPaneContext) => {
  if (tab.props.name == 'all') {
    GISStore.setHideDangerList({ eventState: '', eventGroup: 'event_group_0' })
  } else {
    GISStore.setHideDangerList({ eventState: tab.props.name, eventGroup: 'event_group_0' })
  }
}
</script>
<template>
  <div class="HideDanger">
    <ElCard style="max-width: 100%">
      <template #header>
        <div class="card-header"> 隐患 </div>
      </template>
      <ElTabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
        <ElTabPane label="全部" name="all">
          <HideDangerCard :current-row="GISStore.getHideDangerList" />
        </ElTabPane>
        <ElTabPane
          v-for="item in DictStore.$state.event_state"
          :key="item.dictLabel"
          :label="item.dictLabel"
          :name="item.dictValue"
        >
          <HideDangerCard :current-row="GISStore.getHideDangerList" />
        </ElTabPane>
      </ElTabs>
    </ElCard>
  </div>
</template>
<style scoped>
:deep(.el-card__header) {
  padding: 10px;
  background: rgba(81, 134, 189, 0.8);
  color: #fff;
  font-weight: 600;
  font-size: 15px;
}
:deep(.el-card__body) {
  padding: 0px 30px;
}
.card-header {
  text-align: center;
}
.HideDanger {
  position: absolute;
  width: 400px;
  height: 500px;
  bottom: 0px;
  right: 0px;
  background: #fff;
}
:deep(.el-card__body) {
  height: 500px;
  overflow-y: scroll;
}
</style>
